<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>react-组件</title>
</head>
<body>

<div id="app">

</div>
</body>
<script src="../lib/react/react.development.js"></script>
<script src="../lib/react/react-dom.development.j.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
<script type="text/babel">


    /**
     *  1. 简单用法
     * */

    //const element = <div>hello react</div>;

    //  ReactDOM.render(element,document.getElementById('app'));


    /**
     *  2.函数型组件
     * */
  /*  function HelloMessage(props) {
        return <div>hello react2</div>;
    }

    ReactDOM.render(<HelloMessage/>, document.getElementById('app'))*/


  /**
   *  3.class型组件
   * */
    class Hello extends React.Component {

        render() {
            return <div>hello react3</div>;
        }
    }

    ReactDOM.render(<Hello/>,document.getElementById('app'))


</script>

</html>